<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width,height=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <!--1.width=device-width    //应用程序的宽度和屏幕的宽度是一样的
2.height=device-height  //应用程序的高度和屏幕的高是一样的
3.initial-scale=1.0  //应用程序启动时候的缩放尺度（1.0表示不缩放）
4.minimum-scale=1.0  //用户可以缩放到的最小尺度（1.0表示不缩放）
5.maximum-scale=1.0  //用户可以放大到的最大尺度（1.0表示不缩放）
6.user-scalable=no  //用户是否可以通过他的手势来缩放整个应用程序，使应用程序的尺度发生一个改变（yes/no）
    -->
    <!-- 优先使用 IE 最新版本和 Chrome -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <!-- 启用360浏览器的极速模式(webkit) -->
    <meta name="renderer" content="webkit">
    @include('partner.header')
    <title>登录</title>
</head>
<body>
<!--logo层-->
<div class="logo-box">
    <img src="images/logo_top.png" alt="" class="logo-pic">
    <span class="type-text">合作商版</span>
</div>
<!-- /. logo层 -->
<!--登录层-->
<div class="login-tap-box">
    <!--表头-->
    <ul class="nav nav-tabs login-tap">
        <li>
            <a href="#accountLogin" data-toggle="tab">账号密码登录</a>
        </li>
        <li>
            <a href="#phoneLogin" data-toggle="tab">手机验证登录</a>
        </li>
    </ul>
    <!--登录主体-->
    <div class="tab-content login-inline">
        @if(session('rs'))
        <div class="alert alert-{{session('rs')['status']}}">
          {{ session('rs')['msg'] }}
        </div>
        @endif
        <!--账密登录-->
        <form class="tab-pane fade form-inline login-form form-noborder" role="form" id="accountLogin" method="post" action="{{url('partner/login-do')}}">
            <div class="white-box">
                <div class="form-group">
                    <label class="sr-only"><i class="iconfont icon-account"></i></label>
                    <input type="text" class="form-control" placeholder="请输入手机号码" name="mobile" required="">
                </div>
                <hr class="break-form">
                <div class="form-group">
                    <label class="sr-only"><i class="iconfont icon-password"></i></label>
                    <input type="password" class="form-control password-show" placeholder="请输入密码" name="password"  required="">
                    <button type="button" onclick="visible()" class="btn btn-link btn-if-see"><i class="iconfont icon-visible"></i></button>
                </div>
            </div>
            <button type="submit" class="btn btn-full-green">登录</button>
            <div class="row">
                <div class="col-md-6">
                    <a href="{{url('partner/forget')}}" class="btn btn-link btn-to">登录遇到问题？</a></div>
                <div class="col-md-6">
                    <a href="{{url('partner/reg')}}" class="btn btn-link btn-to "><span class="type-text">合作商入住</span></a>
                </div>
            </div>    
            {{csrf_field()}}
        </form>

        <!--手机号登录-->
        <form class="tab-pane fade form-inline login-form form-noborder" role="form" id="phoneLogin" method="post" action="{{url('partner/login-by-mobile')}}">

            <div class="white-box">
                <div class="form-group">
                    <label class="sr-only"><i class="iconfont icon-quhao"></i></label>
                    <span class="group-select">
                        <select class="select-noborder">
                        <option value="">+86中国</option>
                        </select></span>
                    <input type="text" class="form-control input-inline" placeholder="输入手机号" required="" name="mobile" id="loginMobile">
                </div>
                <hr class="break-form">
                <div class="form-group">
                    <label class="sr-only"><i class="iconfont icon-phone"></i></label>
                    <input type="text" class="form-control input-inline" placeholder="请输入验证码" required=""   name="validatecode">
                    <button type="button" class="btn btn-verification" id="getcode">获取验证码</button>
                </div>
                
            </div>

            <button type="submit" class="btn btn-full-green">登录</button>
            <div class="row">
                <div class="col-md-6">
                    <a href="{{url('partner/forget')}}" class="btn btn-link btn-to">登录遇到问题？</a></div>
                <div class="col-md-6">
                    <a href="{{url('partner/reg')}}" class="btn btn-link btn-to "><span class="type-text">合作商入住</span></a>
                </div>
            </div>   
            {{csrf_field()}}
        </form>
    </div>
</div>
<!-- /. 登录层 -->
<!--jquery-->
@include('partner.footer')
<script>
    //登录方式切换tap 默认展示第一个标签
    // 选取第一个标签页
    $('.login-tap a:first').tab('show')
    //点击密码可见隐藏切换
    function visible(){
        if($('.password-show').attr('type')=='password'){
            $('.password-show').attr('type','text')
        }else if($('.password-show').attr('type')=='text'){
            $('.password-show').attr('type','password')
        }
    }

    var countdown = 60;
    $('#getcode').on('click',function(){
        var _this = $(this);
        var url = "{{url('partner/send-sms')}}";
        var data = {};
        data.mobile = $('#loginMobile').val();
        if(checkPhone(data.mobile)==false) {
            alert('手机号码格式错误');
            return false;
        }
        $.get(url,data,function(rs){
            console.info(rs);
            setTime(_this);
        });
    })
    
    
    function setTime(obj) {
        if (countdown == 0) {
            obj.prop('disabled', false);
            obj.text("获取验证码");
            countdown = 60;//60秒过后button上的文字初始化,计时器初始化;
            return;
        } else {
            obj.prop('disabled', true);
            obj.text("再次获取("+countdown+"s)") ;
            countdown--;
        }
        setTimeout(function() { setTime(obj) },1000) //每1000毫秒执行一次

       
    }
</script>
</body>
</html>